@extends('layouts/main')
@section('content')
<div style="padding: 15px;">
    @if($db_name)
        <div>
            <a class="layui-btn" href="/index/createTable?db_name={{$db_name}}">新建表</a>
            <button class="layui-btn layui-btn-danger" onclick="deleteDatabase('{{$db_name}}')">删除数据库</button>
            <button class="layui-btn layui-btn-normal show-export-content-btn">导出数据库</button>

            导入SQL文件：
            <button type="button" class="layui-btn" id="upload_sql_file">
                <i class="layui-icon">&#xe67c;</i>上传SQL文件
            </button>
        </div>
        <div class="export-sql-content" style="display: none;">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">导出选项</label>
                    <div class="layui-input-block">
                        <input type="radio" name="is_export_list" value="0" title="仅导出表结构" checked>
                        <input type="radio" name="is_export_list" value="1" title="导出表结构和数据">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="export">立即导出</button>
                        <button type="button" class="layui-btn layui-btn-primary display-none-btn">收起</button>
                    </div>
                </div>
            </form>
        </div>
        <table class="layui-table">
            <colgroup>
                <col width="150">
                <col width="200">
                <col>
            </colgroup>
            <thead>
            <tr>
                <th>{{$db_name}}所有表（{{$total_table}}）</th>
            </tr>
            </thead>
            <tbody>
            @foreach($table_list as $v)
                <tr>
                    <td><a href="/index/record?db_name={{$db_name}}&table_name={{$v[0]}}" target="_blank">{{$v[0]}}@if($v['TABLE_COMMENT'])({{ $v['TABLE_COMMENT']  }})@endif</a></td>
                </tr>
            @endforeach
            </tbody>
        </table>
    @else
        请在左侧选择一个数据库以查看该数据库下的表
    @endif
</div>

<script type="text/javascript">
    layui.use('form', function(){
        var form = layui.form;

        //监听提交
        form.on('submit(export)', function(data){
            location.href = '/database/exportSqlFile?db_name={{$db_name}}&is_export_list='+data.field.is_export_list
            return false;
        });
    });
    $('.show-export-content-btn').click(function () {
        $('.export-sql-content').show();
    })
    $('.display-none-btn').click(function () {
        $('.export-sql-content').hide();
    })
    layui.use('upload', function(){
        var upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            before: function() {
                var upload_loading = layer.load(1);
            }
            ,elem: '#upload_sql_file' //绑定元素
            ,accept: 'file'
            ,size: 50000
            ,data: {
                type: 'sql',
                _token: $('meta[name="csrf-token"]').attr('content'),
            }
            ,url: '/upload/index' //上传接口
            ,done: function(res){
                layer.closeAll();
                if (res.status == 200) {
                    layer.msg('上传成功');
                    $postData = {
                        file_path: res.data.file_path,
                        db_name: '{{$db_name}}',
                        _token: $('meta[name="csrf-token"]').attr('content'),
                    }
                    var result = sendAjaxRequest('POST', '/database/importSqlFile', $postData, false);
                    if (result.status == 0) {
                        layer.msg('导入成功');
                        reloadPage();
                    } else {
                        layer.msg(result.msg, {
                            icon: 5,
                            time: 5000,
                            anim: 6,
                            closeBtn: 1,
                        });
                    }
                } else {
                    layer.msg(res.msg, {
                        icon: 5,
                        time: 5000,
                        anim: 6,
                        closeBtn: 1,
                    });
                }
            }
            ,error: function(){
                //请求异常回调
            }
        });
    });
	$('.create-db').on('click', function(){
        layer.open({
			  type: 2,
            title: '新建数据库',
            area: ['500px', '300px'],
			  content: '/layer/createDb', //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
			});
	})
	$('.confirm-create-db').on('click', function(){
		 $.ajax({
                url:'/database/getAllCharset',
                type: 'get',
                dataType: 'json',
                data: {
                
                },
                success: function (res) {
                    console.log(res)
                    // for (var i=0; i< res.data.length; i++) {
                    //     $('#table-field').append('<td>'+res.data[i].COLUMN_NAME+' '+res.data[i].COLUMN_COMMENT+'</td>');
                    // }
                }
            })
	})
</script>
@endsection